import qs from 'qs';
import { ref, reactive, nextTick, onMounted } from "vue"
import { type PaginationProps } from "@pureadmin/table";
import { GetMenuBy } from "@/api/stu/bigdataprocessing"
import { GetBigDataCase, UpdateBigDataCase, DeleteBigDataCase } from "@/api/admin/bigDataCase"
import { ElMessage, ElMessageBox, FormInstance } from "element-plus";
import { emitter } from "@/utils/mitt";
export function useCase() {
  const loading = ref<boolean>(false);
  const dataList = ref<object | undefined>([]);
  const CaseTypeList = ref<any>([])
  const columns: TableColumnList = [
    {
      label: "序号",
      type: "index",
      minWidth: 100
    },
    {
      label: "案例类别",
      prop: "parentMenuName",
      minWidth: 200
    },
    {
      label: "案例名称",
      prop: "menuName",
      minWidth: 200
    },
    {
      label: "案例描述",
      prop: "remarks",
      minWidth: 200,
      cellRenderer: () => <span>点击修改查看内容详情</span>
    },
    {
      label: "案例流程",
      prop: "processFlow",
      minWidth: 200,
      cellRenderer: () => <span>点击修改查看内容详情</span>
    }, {
      label: "操作",
      fixed: "right",
      width: 200,
      slot: "operation"
    }
  ];
  const UpedateRef = ref();
  const SearchCaseType = ref();
  const loadingTitle = ref<string>("");
  const UpdateVisible = ref<boolean>(false);
  const SetDisabled = ref<boolean>(false);
  const rules = {
    parentMenuId: [
      {
        required: true,
        message: "请选择案例类别！",
        trigger: ["blur", "change"]
      }
    ],
    caseName: [
      {
        required: true,
        message: "请输入案例名称！",
        trigger: ["blur", "change"]
      }
    ],
    remarks: [
      {
        required: true,
        message: "请输入应用描述！",
        trigger: ["blur", "change"]
      }
    ],
    processFlow: [
      {
        required: true,
        message: "请输入业务流程！",
        trigger: ["blur", "change"]
      }
    ],
  };
  const updatefrom = reactive({
    menuId: "",
    parentMenuId: "", // 案例类别
    caseName: "", // 案例名称
    remarks: "", // 应用描述
    processFlow: "", // 业务流程
    userId: 'Admin'
  })
  // 分页
  const pagination = reactive<PaginationProps>({
    total: 0,
    pageSize: 10,
    currentPage: 1,
    background: true
  });

  // 获取案例类别
  async function GetCaseType() {
    const menuid = qs.stringify({ moudleId: 688 });
    const respone = await GetMenuBy(menuid);
    if (!respone.success) return;
    CaseTypeList.value = respone.data;
  }

  // 获取案例列表
  async function onSearch() {
    const row = {
      pageIndex: pagination.currentPage,
      pageSize: pagination.pageSize,
      parentMenuId: SearchCaseType.value
    }
    const rows = qs.stringify(row)
    const respone = await GetBigDataCase(rows);
    if (respone.success) {
      dataList.value = respone?.data?.list;
      pagination.total = respone?.data?.totalCount
    } else {
      ElMessage.error(respone.msg)
    }
  }
  // 添加 and 修改 and 查看
  function DetailsUpdate(row: any | undefined) {
    UpdateVisible.value = true;
    if (row) {
      loadingTitle.value = "修改";
      nextTick(() => {
        SetDisabled.value = true;
        updatefrom.menuId = row.menuId
        updatefrom.caseName = row.menuName;
        updatefrom.parentMenuId = row.parentMenuId;
        updatefrom.remarks = row.remarks;
        updatefrom.processFlow = row.processFlow;
      })
    } else {
      updatefrom.menuId = ""
      loadingTitle.value = "添加";
      SetDisabled.value = false;
    }
  }

  // 保存
  function addCase(UpedateRef: FormInstance | undefined) {
    (UpedateRef as any).validate(async valid => {
      if (!valid) return;
      const res = !updatefrom.menuId
        ? updatefrom
        : updatefrom;
      const respone = await UpdateBigDataCase(res)
      if (respone.success) {
        ElMessage.success(respone.msg)
        UpdateVisible.value = false;
        onSearch()
        UpedateRef.resetFields()
      } else {
        ElMessage.error(respone.msg)
      }
    })
  }

  // 删除
  function handleDelete(row: any) {
    ElMessageBox({
      title: '提示', //MessageBox 标题
      closeOnClickModal: false,
      message: '是否确定删除当前项?', //MessageBox 消息正文内容
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    }).then(async () => {
      const menuId = qs.stringify({ menuId: row.menuId })
      const respone = await DeleteBigDataCase(menuId)
      if (respone.success) {
        ElMessage.success(respone.msg);
        onSearch();
        return;
      }
      ElMessage.warning(respone.msg);
    }).catch(() => { })
  }

  // 点击查看测评管理
  function RowDblclick(row, column, event) {
    // 兄弟传值-传
    emitter.emit("getEvalList", row);
  }

  // 监听页面-- 分页显示数量
  function handleSizeChange() {
    onSearch();
  }

  // 分页
  function handleCurrentChange() {
    onSearch();
  }

  //关闭弹窗
  function ClosePanelVisible(row: any) {
    UpdateVisible.value = false;
    row.resetFields();
  }


  onMounted(() => {
    GetCaseType();
    onSearch()
  })

  return {
    rules,
    columns,
    loading,
    dataList,
    CaseTypeList,
    pagination,
    UpdateVisible,
    SearchCaseType,
    SetDisabled,
    loadingTitle,
    UpedateRef,
    updatefrom,
    addCase,
    onSearch,
    RowDblclick,
    handleDelete,
    DetailsUpdate,
    handleSizeChange,
    handleCurrentChange,
    ClosePanelVisible
  }
}
